<html>
	<header>
	
	
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">

	 
	<script src="https://minedata.cn/minemapapi/v1.3/minemap.js"></script>


   
    <style>
        html, body, #map {
            width: 100%;
            height: 100%;
        }

        html, body {
            margin: 0;
            padding: 0;
        }
		
		  *{
            margin:0;
            padding:0;
        }
        body,html{
            height:100%;
        }
        #container,#map,#deck-layer{
            height:100%;
        }
        
	
</style>
</header>
<body>
<div id="container">
    <div id="map"></div>
    
</div>
 

<script>
  
 
minemap.accessToken = '449ba822788c46bea9f90dfba48e5269';
minemap.solution = '4013';

var myjson = {}

const map = new minemap.Map({
    container: 'map',
    style: 'http://minedata.cn/service/solu/style/id/4013',
    center: [118.8386378, 37.0313616],
    zoom: 10,
    bearing: 0,
    pitch: 45,
});


map.on('load', function () {
	
	 

    map.addLayer({
        "id": "points",
        "type": "circle",
        "source": {
            "type": "vector",
            "tiles": ["http://localhost:8004/test/pbf/{z}/{x}/{y}"]
        },
        "source-layer": "position",
        "paint": {
            "circle-radius":1,
            "circle-color":"#00ff00"
        }
    });
});
 
</script>   
</body>
</html>